iT邦幫忙

DAY 3
3

使用ASP.NET MVC 實作購物網站系列 第 3

使用ASP.NET MVC 實作購物網站 (三) - MVC概念

  • 分享至 

  • xImage
  •  

今天介紹MVC的概念

MVC是模型(Model) 檢視(View) 控制器(Controller) 的縮寫,概念是把整個完整的程式邏輯區分為三塊:

[*]控制器(Controller) :負責處理及轉發要求(Request),可以視情況呼叫Model拿資料,也視情況呼叫View來回應,而控制器中會包含多個動作(Action)。
[*]模型(Model) :專門處理資料的相關邏輯。
[*]檢視(View) :專門展示處理結果給使用者,提供UI。

以ASP MVC舉例,一個正常的Http Request會完成以下動作:
[*]某個Web使用者點選了網頁連結為[http://localhost.test.com/Home/Index]
[*]路由(route)決定交付名稱為Home的控制器中的Index動作(Action)來進行
[*]Index動作先跟Model拿了資料
[*]Index動作將取得的資料交給View
[*]View根據資料來顯示畫面給Web使用者觀看

如此完成了一個要求。

而在ASP.NET MVC 的方案目錄結構如下圖(各位可以開啟你的專案來對照囉):

[*]App_Data - 預設ASP.NET User的本機資料庫檔案
[*]AppStart - 網站起始設定
[*]Content - 存放css檔案 (*.css)
[*]Controller - 所有控制器的原始碼(*.cs)
[*]fonts- 字型
[*]Models - 與模型相關的原始碼
[*]Scripts - 存放JavaScript檔案(*.js)
[*]View - 所有檢視的原始碼,依據不同的Controller名稱會有對應名稱的目錄

以上讀者可能會覺得無聊,這是概念性的內容,當初小弟也是花了一段時間才大致了解MVC架構的,所以暫時看不懂也沒關係,不會影響接下來的操作。

開始動手吧~

在ASP.NET MVC中,路由可視為處理Url進入點,所有進入點都是URL,也就是像[http://localhost/Home/Index]這種東東,我們現在打開HomeController.cs吧:

我們新增一個名為Index2的Action,內容如下:

運行結果:

第一個修改已經完成了,又往前一步囉,有沒有發現其實在ASP.NET MVC的框架下寫出Web應用程式其實很簡單呢?我們會慢慢熟悉MVC架構的,明天將針對路由作更詳細的介紹。

※今天的專案原始碼可在這裡下載


上一篇
使用ASP.NET MVC 實作購物網站 (二) - 第一個Web應用程式
下一篇
使用ASP.NET MVC 實作購物網站 (四) - 路由簡介(Route) 與 控制器(Controller)
系列文
使用ASP.NET MVC 實作購物網站30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

0
willardryan
iT邦新手 5 級 ‧ 2021-12-04 10:51:55

買大您好
可否可我範例檔的存取權呢?
我的email 是 ha8866@gmail.com

我要留言

立即登入留言